import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sabre_sync_fencing/dd_core/dd_ios_pay_service.dart';
import 'package:sabre_sync_fencing/dd_core/dd_other.dart';

import '../../../dd_core/dd_log_service.dart';
import '../../../dd_models/dd_goods_model.dart';
import '../../../r.dart';
import '../controllers/dd_coin_shop_controller.dart';

class DDCoinShopPage extends StatefulWidget {
  const DDCoinShopPage({Key? key}) : super(key: key);

  @override
  State<DDCoinShopPage> createState() => _DDCoinShopPageState();
}

class _DDCoinShopPageState extends State<DDCoinShopPage> {
  DDCoinShopController _controller = DDCoinShopController();

  @override
  Widget build(BuildContext context) {
    return GetBuilder<DDCoinShopController>(
        init: _controller,
        initState: (state) {
          DDLogService().ddGa(page: "purchase");
        },
        dispose: (state) {},
        builder: (controller) {
          return Scaffold(
            appBar: AppBar(
              title: Text('Coin Shop'),
              leading: IconButton(
                icon: Image.asset(R.assetsImagesHomeSecond1),
                onPressed: () {
                  Get.back();
                },
              ),
            ),
            body: Padding(
                padding: const EdgeInsets.only(
                    left: 18.0, right: 18, top: 10, bottom: 10),
                child: Obx(
                  () =>
                  SingleChildScrollView(
                    child:  Column(
                      children: [
                        Stack(
                          children: [
                            Positioned.fill(
                              child: Padding(
                                padding: const EdgeInsets.only(top: 0.0),
                                child: Image.asset(
                                  R.assetsImagesPerson18,
                                  fit: BoxFit.fill,
                                ),
                              ),
                            ),
                            Padding(
                              padding: const EdgeInsets.only(
                                  left: 39.0, right: 25, top: 20, bottom: 20),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  Row(
                                    children: [
                                      Image.asset(R.assetsImagesPerson16),
                                      SizedBox(width: 10),
                                      Text('My Coins',
                                          style: TextStyle(fontSize: 18)),
                                    ],
                                  ),
                                  AutoSizeText(
                                      '${_controller.availableCoins ?? 0}',
                                      maxLines: 1,
                                      minFontSize: 8,
                                      style: TextStyle(
                                          fontSize: 26,
                                          fontWeight: FontWeight.w900,
                                          color: Color(0xff53BFD7))),
                                ],
                              ),
                            ),
                          ],
                        ),
                        SizedBox(height: 16),
                        GridView.builder(
                          shrinkWrap: true,
                          physics: NeverScrollableScrollPhysics(),
                          gridDelegate:
                          SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 2,
                            mainAxisSpacing: 25.0,
                            crossAxisSpacing: 13.0,
                            childAspectRatio: 1.15,
                          ),
                          itemCount: _controller.googsObx.length,
                          itemBuilder: (context, index) {
                            return CoinItemWidget(
                              coinItem: _controller.googsObx[index],onClick: (){
                              DDGoodsModel model = _controller.googsObx[index];
                              Get.find<DDIosPayService>().createOrder(model.code ?? '',"IAP");
                            },);
                          },
                        ),
                      ],
                    )

                  )
                )),
          );
        });
  }
}


class CoinItemWidget extends StatelessWidget {
  final DDGoodsModel coinItem;
  final Function()? onClick;

  const CoinItemWidget({Key? key, required this.coinItem, this.onClick}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Stack(
      clipBehavior: Clip.none,
      children: [
        DDSafeButton(
            onPressed: () {
              if(this.onClick!= null){
                this.onClick!();
              }
            },
            child: Container(
              padding: EdgeInsets.only(left: 12, right: 12, bottom: 6, top: 6),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(8.0),
                border: Border.all(color: Color(0xff4C5961), width: 2),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Image.asset(R.assetsImagesPerson17),
                  SizedBox(height: 10),
                  (coinItem.discount ?? 0 ) > 0 ?
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text('${coinItem.exchangeCoin}',
                          style: TextStyle(
                              fontSize: 20,
                              fontWeight: FontWeight.bold,
                              color: Color(0xff565656))),
                      SizedBox(
                        width: 8,
                      ),
                      Text('${(coinItem.discount!*100).toInt()}% off',
                          style:
                              TextStyle(fontSize: 9, color: Color(0xffE67B4B))),
                    ],
                  ):Text('${coinItem.exchangeCoin}',
                      style: TextStyle(
                          fontSize: 20,
                          fontWeight: FontWeight.bold,
                          color: Color(0xff565656))),
                  SizedBox(height: 30),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: [
                      Spacer(),
                      Text('\$${coinItem.price?.toStringAsFixed(2)}',
                          style: TextStyle(
                              fontSize: 14,
                              fontWeight: FontWeight.bold,
                              color: Color(0xff53BFD7))),
                      SizedBox(
                        width: 8,
                      ),
                    if (coinItem.price != coinItem.originalPrice)
                      Text('\$${coinItem.originalPrice?.toStringAsFixed(2)}',
                          style: TextStyle(
                              fontSize: 10,
                              color: Color(0x80000000),
                              decoration: TextDecoration.lineThrough)),
                    ],
                  ),
                ],
              ),
            )),

        if (coinItem.tags.dd_isNotEmpty)
        Positioned(
          top: -5,
          right: 0,
          child: Container(
            height: 24,
            width: 59,
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage(R.assetsImagesPerson19),
                fit: BoxFit.cover,
              ),
            ),
            child: Text(
              (coinItem.tags ?? "") == "Hot" ?  ('${(coinItem.tags ?? '')} 🔥') :
                coinItem.tags ?? '',
                style: TextStyle(color: Colors.white, fontSize: 12,),
                textAlign: TextAlign.center,
              ),
          ),
        ),
      ],
    );
  }
}
